{% extends 'xadmin/base.html' %}
{% load staticfiles %}
{% load node_tag %}

{% block title %}
    文章管理
{% endblock %}

{% block css %}
    <link href="{% static 'xadmin/css/plugins/toastr/toastr.min.css' %}" rel="stylesheet">
    <link href="{% static 'xadmin/css/bootstrap-switch.css' %}" rel="stylesheet">
{% endblock %}

{% block btn %}
    <button type="button" class="btn btn-xs btn-outline btn-primary" onclick="add_article();">添加文章</button>
{% endblock %}

{% block main %}
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <form action="" method="get" class="form-inline col-lg-5" style="padding-left:40px;">
                <input type="hidden" value="{{ siteid }}" name="siteid">
                <input type="hidden" value="{{ recy }}" name="t">
                <div class="form-group">
                    <label>搜索</label>
                    <input type="text" class="form-control input-sm" id="keywords" name="keyword" value="{{ keyword }}">
                </div>
                <div class="form-group">
                    <label>栏目</label>
                    <select class="form-control" id="nodeid" name="nodeid" style="width:200px;">
                        <option value="0">-----------</option>
                        {% for n in node_list %}
                            {% if n.id == nodeid %}
                                <option value="{{ n.id }}" selected>{{ n.name }}</option>
                            {% else %}
                                <option value="{{ n.id }}"  {{ n.node_type | isDisabled }}>{{ n.node_level | goright }}{{ n.name }}</option>
                            {% endif %}
                        {% endfor %}
                    </select>
                </div>
                <div class="form-group">
                    <button type="submit" class="btn btn-outline btn-default" style="margin-bottom: 0">搜索</button>
                </div>
            </form>
            <div class="col-lg-3">
                <div class="form-group">
                    <label>文章组</label>
                    <select class="form-control" name="groupid" id='groupid' style="width:200px;display:inline-block;">
                        <option value="0">-----------</option>
                        {% for g in article_groups %}
                            {% if g.id == groupid %}
                                <option value="{{ g.id }}" selected>{{ g.name }}</option>
                            {% else %}
                                <option value="{{ g.id }}">{{ g.name }}</option>
                            {% endif %}
                        {% endfor %}
                    </select>
                </div>
            </div>
            <div class="col-lg-3 col-lg-offset-1">
            {% if recy != 'recy' %}
                {% if request.user.is_superuser %}
                    <button type="button" class="btn btn-xs btn-primary" onclick="add_article();"><i class="fa fa-plus"></i>添加文章</button>
                    <button type="button" class="btn btn-xs btn-primary" onclick="articles_move()"><i class="fa fa-share"></i>移动</button>
                    <button type="button" class="btn btn-xs btn-primary" onclick="articles_copy()"><i class="glyphicon glyphicon-file"></i>复制</button>
                    <button type="button" class="btn btn-xs btn-danger" onclick="articles_del()"><i class="glyphicon glyphicon-remove"></i>删除</button>
                    <button type="button" class="btn btn-xs btn-success" onclick="recy_goto()"><i class="glyphicon glyphicon-trash"></i>回收站</button>
                {% else %}
                    {% for perm_type, perm_slug_list in perm_dic.items %}
                        {% if perm_type == 'article' %}
                            {% if 'add' in perm_slug_list %}
                                <button type="button" class="btn btn-xs btn-primary" onclick="window.location.href='add_article();"><i class="fa fa-plus"></i>添加文章</button>
                            {% endif %}
                            {% if 'move' in perm_slug_list %}
                                <button type="button" class="btn btn-xs btn-primary" onclick="articles_move()"><i class="fa fa-share"></i>移动</button>
                            {% endif %}
                            {% if 'copy' in perm_slug_list %}
                                <button type="button" class="btn btn-xs btn-primary" onclick="articles_copy()"><i class="glyphicon glyphicon-file"></i>复制</button>
                            {% endif %}
                            {% if 'delete' in perm_slug_list %}
                                <button type="button" class="btn btn-xs btn-danger" onclick="articles_del()"><i class="glyphicon glyphicon-remove"></i>删除</button>
                                <button type="button" class="btn btn-xs btn-success" onclick="recy_goto()"><i class="glyphicon glyphicon-trash"></i>回收站</button>
                            {% endif %}
                        {% endif %}
                    {% endfor %}
                {% endif %}
            {% else %}
                <button type="button" class="btn btn-xs btn-danger" onclick="clear_recy()"><i class="glyphicon glyphicon-remove"></i>清空回收站</button>
                <a class="btn btn-xs btn-success" href="{% url 'articlelist' %}?siteid={{ siteid }}"><i class="fa fa-reply"></i>&nbsp返回</a>
            {% endif %}            



            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-content" style="border-width:0px 0px">
                        <div class="table-responsive">
                            <table class="table table-striped  table-hover">
                                <thead style="background: rgba(237, 240, 245, 0.5);">
                                    <tr>
                                        <th>
                                            <div class="icheckbox_square-green " style="position: relative;">
                                                <input type="checkbox" class="i-checks checkall" name="input[]" style="position: absolute; opacity: 0;">
                                            </div>
                                        </th>
                                        <th>标题</th>
                                        <th>发布日期</th>
                                        <th>栏目</th>
                                        <th>是否激活</th>
                                        <th>点击量</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for article in article_list %}
                                        <tr>
                                            <td>
                                                <div class="icheckbox_square-green" style="position: relative;">
                                                    <input type="checkbox" class="i-checks" name="input[]" value="{{ article.id }}" style="position: absolute; opacity: 0;">
                                                </div>
                                            </td>
                                            <td>{{ article.title}}</td>
                                            <td>{{ article.add_time }}</td>
                                            <td>{{ article.parent_node.name }}</td>
                                            <td><input type="checkbox" name="isactive" id="{{ article.id }}" data-on-color="success" {% if article.is_active %}checked{% endif %}></td>
                                            <td>{{ article.hit }}</td>
                                            <td>
                                                {% if request.user.is_superuser %}
                                                    {% if recy != 'recy' %}
                                                        <a  class="btn btn-xs btn-outline btn-primary"  onclick="article_edit({{ article.id }});">编辑</a>
                                                        <a  class="btn btn-xs btn-outline btn-warning" onclick="article_del({{ article.id }})">删除</a>
                                                        {% if groupid %}
                                                            <a  class="btn btn-xs btn-outline btn-warning" onclick="removeGroup({{ article.id }})">移出文章组</a>
                                                        {% else %}
                                                            <a  class="btn btn-xs btn-outline btn-warning" onclick="addGroup({{ article.id }})">添加到组</a>
                                                        {% endif %}
                                                    {% else %}
                                                        <a  class="btn btn-xs btn-outline btn-warning" onclick="article_clear({{ article.id }})">删除</a>
                                                        <a  class="btn btn-xs btn-outline btn-warning" onclick="restore({{ article.id }})">还原</a>
                                                    {% endif %}
                                                {% else %}
                                                    {% for perm_type, perm_slug_list in perm_dic.items %}
                                                        {% if perm_type == 'article' %}
                                                            {% if 'update' in perm_slug_list %}
                                                                <a  class="btn btn-xs btn-outline btn-primary"  onclick="article_edit({{ article.id }});">编辑</a>
                                                            {% endif %}
                                                            {% if 'delete' in perm_slug_list %}
                                                                {% if recy != 'recy' %}
                                                                    <a  class="btn btn-xs btn-outline btn-warning" onclick="article_del({{ article.id }})">删除</a>
                                                                {% else %}
                                                                    <a  class="btn btn-xs btn-outline btn-warning" onclick="article_clear({{ article.id }})">删除</a>
                                                                    <a  class="btn btn-xs btn-outline btn-warning" onclick="restore({{ article.id }})">还原</a>
                                                                {% endif %}
                                                            {% endif %}
                                                        {% endif %}
                                                        {% if perm_type == 'articlegroup' and recy != 'recy' %}
                                                            {% if 'add' in perm_slug_list or 'update' in perm_slug_list %}
                                                                {% if groupid %}
                                                                    <a  class="btn btn-xs btn-outline btn-warning" onclick="removeGroup({{ article.id }})">移出文章组</a>
                                                                {% else %}
                                                                    <a  class="btn btn-xs btn-outline btn-warning" onclick="addGroup({{ article.id }})">添加到组</a>
                                                                {% endif %}
                                                            {% endif %}
                                                        {% endif %}
                                                    {% endfor %}
                                                    
                                                {% endif %}
                                                
                                            </td>
                                            </td>
                                        </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div id="pagnitor" style="margin-left:40px;"></div>
        </div>
    </div>

{% endblock %}

{% block script %}
    <script src="{% static 'xadmin/js/bootstrap-switch.js' %}"></script>
    <script src="{% static 'xadmin/js/plugins/toastr/toastr.min.js' %}"></script>
    <script src="{% static 'xadmin/js/myjs/toastr_customer.js' %}"></script>
    <script>
        //复选框初始化
        $('.i-checks').iCheck({
            checkboxClass: 'icheckbox_square-green dcheckbox',
            radioClass: 'iradio_square-green',
        });
        //全选事件
        $('.checkall').on('ifChecked', function(event){
            $('.i-checks:not(:first)').iCheck('check');
        });
        $('.checkall').on('ifUnchecked', function(event){
            $('.i-checks:not(:first)').iCheck('uncheck');
        });

        //开关组件初始化
        $("[name='isactive']").bootstrapSwitch({
            'size': 'mini',
        });
        //分页
        var laypage = layui.laypage;
        laypage.render({
            elem: 'pagnitor'
            ,count: {{ paginator.count }} //数据总数
            ,limit: {{ pagesize }}
            ,curr: {{ pagenum }}
            ,hash: 'pagenum'
            ,jump: function(obj, first){
              if(!first){
                  curr = obj.curr;
                  var nodeid = $('#nodeid').val();
                  var keywords = $('#keywords').val();
                  console.log(keywords);
                  window.location.href = window.location.pathname + '?siteid=' + '{{ siteid }}' + '&keyword=' + keywords + '&nodeid=' + nodeid + '&pagenum=' + curr;
                }
            }
          });


        //激活按钮
        $("[name='isactive']").on('switchChange.bootstrapSwitch',function(event,state){
            var id = $(this).attr('id');
            var isactive = 0;
            if(state){
                isactive = 1;
            }
            var data = {'id': id, 'isactive': isactive, 'csrfmiddlewaretoken': '{{ csrf_token }}'};
            $.ajax({
                url: '{% url 'articlestate' %}',
                type: 'post',
                dataType: 'json',
                data: data,
                success: function(bk){

                }
            })
            //内置对象、内置属性
           // console.log(event);
            //获取状态
            //console.log(state);
        });


        function article_del(articleid){
            $.ajax({
                url: '{% url 'articledel' %}',
                type: 'post',
                dataType: 'json',
                data: {'articleid': articleid, 'siteid': '{{ siteid }}', 'csrfmiddlewaretoken': '{{ csrf_token }}'},
                success: function(bk){
                    if(bk.status == '200'){
                        send_success_message(bk.message);
                    }else{
                        toastr.error(bk.message);
                    }
                }
            })
        }
        //批量删除
        function articles_del(){
            var id_list = [];
            $('.i-checks:not(:first)').each(function(){
                if($(this).get(0).checked){
                    id_list.push($(this).val());
                }
            });
            if(id_list.length > 0){
                layer.confirm('将删除选中的文章, 是否继续?', {icon: 3}, function(index){
                    layer.close(index);
                    $.ajax({
                        url: '{% url 'articlesdel' %}',
                        type: 'post',
                        dataType: 'json',
                        data: {'ids': id_list.join(','), 'csrfmiddlewaretoken': '{{ csrf_token }}', 'siteid': '{{ siteid }}'},
                        success:function(bk){
                            if(bk.status == '200'){
                                send_success_message(bk.msg);
                            }
                            else{
                                toastr.error(bk.msg);
                            }
                        }
                    });
                })
            }
            else{
                toastr.error('请选择要删除的文章');
            }
        }

        //批量移动
        function articles_move(){
            var id_list = [];
            $('.i-checks:not(:first)').each(function(){
                if($(this).get(0).checked){
                    id_list.push($(this).val());
                }
            });
            if(id_list.length > 0){
                var ids = id_list.join(',');
                layer.open({
                    type: 2,
                    content: '{% url "articlesmove" %}?siteid={{ siteid }}&ids=' + ids,
                    area: ['800px', '600px'],
                    title: '请点击要转移到的栏目, 只能选择叶子节点'
                });
            }
            else{
                toastr.error('请选择要移动的文章');
            }
        }
        //批量复制
        function articles_copy(){
            var id_list = [];
            $('.i-checks:not(:first)').each(function(){
                if($(this).get(0).checked){
                    id_list.push($(this).val());
                }
            });
            if(id_list.length > 0){
                var ids = id_list.join(',');
                layer.open({
                    type: 2,
                    content: '{% url "articlescopy" %}?siteid={{ siteid }}&ids=' + ids,
                    area: ['800px', '600px'],
                    title: '请选择要复制到哪些栏目'
                });
            }
            else{
                toastr.error('请选择要复制的文章');
            }
        }

        //添加到组
        function addGroup(articleid){
            layer.open({
                type: 2,
                content: '{% url "articleaddgroup" %}?siteid={{ siteid }}&articleid=' + articleid,
                area: ['800px', '600px'],
                title: '请选择文章组'
            })
        }

        //文章组筛选
        $('#groupid').change(function(){
            var groupid = $(this).val();
            if(groupid == '0'){
                window.location.href = '{% url "articlelist" %}?siteid=1';
            }
            else{
                window.location.href = '{% url "articlefiltergroup" %}?siteid={{ siteid }}&groupid=' + groupid;
            }
        })

        //添加文章
        function add_article(){
            var nodeid = $('#nodeid').val();
            //console.log(nodeid);
            window.location.href="{% url 'articleadd' %}" + "?siteid=" + '{{ siteid }}' + '&nodeid=' + nodeid;
        }
        //编辑文章
        function article_edit(articleid){
            var nodeid = $('#nodeid').val();
            var pagenum = '{{ pagenum }}';
            var url = '/admin/article/edit/' + articleid + '/';
            window.location.href = url +  '?siteid={{ siteid }}&nodeid=' + nodeid + '&pagenum=' + pagenum;
        }

        //移出文章组
        function removeGroup(articleid){
            var groupid = '{{ groupid }}';
            layer.confirm('要从文章组中移出吗？', function(index){
                layer.close(index);
                var groupid = '{{ groupid }}';
                $.ajax({
                        url: '{% url 'articleremovegroup' %}',
                        type: 'post',
                        dataType: 'json',
                        data: {'groupid': groupid, 'articleid': articleid, 'csrfmiddlewaretoken': '{{ csrf_token }}', 'siteid': '{{ siteid }}'},
                        success:function(bk){
                            if(bk.status == '200'){
                                send_success_message(bk.msg);
                            }
                            else{
                                toastr.error(bk.msg);
                            }
                        }
                    });
            })
        }
        
        
        //回收站
        function recy_goto(){
            var nodeid = $('#nodeid').val();
            window.location.href = '{% url "articlelist" %}?siteid={{ siteid }}&t=recy&nodeid=' + nodeid;
        }

        //回收站还原
        function restore(articleid){
            layer.confirm('要还原这篇文章吗？', {icon: 3}, function(index){
                layer.close(index);
                var groupid = $('#groupid').val();
                var nodeid = $('#nodeid').val();
                var keyword = $('#keywords').val();
                var data = {
                    'siteid': {{ siteid }},
                    'nodeid' : nodeid,
                    'articleid': articleid,
                    'pagenum': '{{ pagenum }}',
                    'keyword': keyword,
                    'groupid': groupid,
                    'csrfmiddlewaretoken': '{{ csrf_token }}',
                };
                url = '{% url "articlerestore" %}';
                $.ajax({
                    url: url,
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    success: function(rec){
                        console.log(rec);
                        if(rec.status == '200'){
                            send_success_message(rec.msg);
                        }
                    }
                })
            });
        }

        //回收站删除
        function article_clear(articleid){
            layer.confirm('将从回收站中删除文章，此操作不可逆转，确定要删除吗？', {icon:3}, function(index){
                layer.close(index);
                $.ajax({
                    url: '{% url "articleclear" %}',
                    type: 'post',
                    data: {'articleid': articleid, 'csrfmiddlewaretoken': '{{ csrf_token }}', 'siteid': '{{ siteid }}'},
                    dataType: 'json',
                    success: function(rec){
                        if(rec.status == '200'){
                            send_success_message(rec.msg);
                        }
                    }
                })
            })
        }

        //清空回收站
        function clear_recy(){
            layer.confirm('将清空回收站，此操作不可逆转，确定要清空吗？', {icon:3}, function(index){
                layer.close(index);
                $.ajax({
                    url: '{% url "articleclearall" %}',
                    type: 'post',
                    data: {'csrfmiddlewaretoken': '{{ csrf_token }}', 'siteid': '{{ siteid }}'},
                    dataType: 'json',
                    success: function(rec){
                        if(rec.status == '200'){
                            send_success_message(rec.msg);
                        }
                    }
                })
            })
        }

    </script>

{% endblock %}